<!-- 贡献明细 -->
<template>
  <div>
    <van-pull-refresh v-model="isLoading" @refresh="onRefresh" style="height:calc(100vh - 46px);overflow: auto;">
      <van-list v-model="loading" :finished="finished" finished-text="我是有底线的" @load="onLoad" v-if="getList.length>0" :immediate-check="false"
        :offset="10">
        <div class="list" v-for="item in getList" :key="item.id">
          <van-row>
            <van-col span="17" class="dsf">
              <img v-if="item.memberImage" :src="item.memberImage" alt="">
              <img v-else src="@/assets/images/mobileLogo.jpg" alt="">
              <span class="red">{{item.mobile = item.mobile.substring(0,3) + '****' + item.mobile.substring(7,11)}}</span>
              <van-tag mark type="success">{{item.levelName}}</van-tag>
            </van-col>
            <van-col span="7" class="dsf tar">
              投入<a class="red">{{item.amt}}</a>USDT
            </van-col>
          </van-row>
          <van-row>
            <van-col span="17" class="dsf">
              <p class="gray">{{common.formatDate(item.tradeTime)}}</p>
            </van-col>
            <van-col span="7" class="dsf tar">
              获得贡献分<a class="red">{{item.mark}}</a>
            </van-col>
          </van-row>
        </div>
      </van-list>
      <div v-else class="list_text">{{listText}}</div>
    </van-pull-refresh>

  </div>
</template>

<script>
export default {
  data () {
    return {
      getList: [],
      isLoading: false,
      finished: false,  //是否加载完所有数据
      loading: false,  //是否加载完所有数据
      data: {
        pageSize: 10,
        currentPage: 1,
        projectId: this.$route.query.id,
      },
      listText: '',
    }
  },
  methods: {
    onLoad () {      //上拉加载
      setTimeout(() => {
        this.queryList()
        this.loading = true
        this.data.currentPage++
      }, 500)
    },
    onRefresh () {
      setTimeout(() => {
        this.isLoading = false;
        this.loading = false
        this.finished = false
        this.data.currentPage = 1;
        this.getList = []
        this.queryList()
        this.$toast('刷新成功');
      }, 500);
    },
    async queryList () {
      const url = `/devote/queryPage`
      let result = await this.request.mobileRequest('POST', url, this.data)
      if (result.code == 200) {
        this.loading = false
        if (this.data.currentPage == 1) {
          this.getList = result.data.datas
        } else {
          if (result.data.datas != '' && this.data.currentPage > 1) {
            this.getList = this.getList.concat(result.data.datas)
          }
        }
        if (result.data.datas.length < this.data.pageSize) {
          this.finished = true
        }
        if (this.getList.length == 0) {
          this.listText = '暂无数据'
        }
      } else {
        this.$notify({ type: 'warning', message: result.msg });
      }
    }
  },
  mounted () {
    this.queryList();
  }
}
</script>

<style scoped>
.dsf {
  height: 0.8rem;
  display: flex;
  align-items: center;
}
.list {
  padding: 0.2rem 0.3rem;
  background: #fff;
  border-bottom: 0.01rem solid #d9d9d9;
}
.van-col img {
  width: 0.8rem;
  height: 0.8rem;
  border-radius: 50%;
}
.van-col span {
  margin-left: 0.2rem !important;
}
/* .van-col van-tag{
		padding-left:.2rem!important;
	} */
</style>
